<template>
  <div style="margin-top: 60px;">
    <img src="@/assets/logo.png">
    <div>
      <x-input type="text" placeholder="请输入用户名" v-model="loginParam.userName"></x-input>
      <x-input type="password" placeholder="请输入密码" v-model="loginParam.password"></x-input>
      <flexbox>
        <flexbox-item><x-input type="text" placeholder="请输入验证码" v-model="loginParam.code"></x-input></flexbox-item>
        <flexbox-item><x-img :src="imgSrc"></x-img></flexbox-item>
      </flexbox>
      <x-button text="登录" @click.native="login"></x-button>
      <x-button text="退出" @click.native="logout"></x-button>
    </div>
  </div>
</template>

<script>
  import * as config from '../config/index'
  import { XInput, XButton, XImg, Flexbox, FlexboxItem } from 'vux';

  export default {
    components: {
      XInput,
      XButton,
      XImg,
      Flexbox,
      FlexboxItem
    },
    name: 'Login',
    data () {
      return {
        loginParam: {
          userName: '13720823403',
          password: '111111',
          regisType: 'normal',
          code: '',
          mac: '1'
        },
        imgSrc: config.rootpath + '/imageServlet?'+new Date().getTime(),
        redirect: null// 重定向地址
      }
    },
    methods: {
      login () {
        this.$http.post(config.rootpath + '/healthcare/user/login', this.loginParam).then((response) => {
          // 响应成功回调
          var body = response.body
          if (body.code === 0) {
            var data = body.data
            this.setObjItemToStore('userInfo',data.user)
            if (this.redirect == null) {
              this.$router.replace({name: 'Index'})
            }else{
              this.$router.replace({path: this.redirect})
            }
          } else {
            this.showToast(body.message)
          }
        }, (response) => {
          // 响应错误回调
          this.showToast('请求错误')
        })
      },
      showToast (text) {
        this.$store.commit('showToast', text)
      },
      logout () {
        this.removeObjItemFromStore('userInfo')
      }
    },
    mounted () {
      this.redirect = this.$route.query.redirect
    }
  }
</script>

<style scoped>

</style>
